<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>管理员中新</title>
<script type="text/javascript" src="/resource/js/jquery-3.2.1/jquery.js"></script>
<script type="text/javascript" src="/resource/bootstrap-4.5.0-dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="/resource/bootstrap-4.5.0-dist/css/bootstrap.css">

</head>
<body>	
	<div class="container">
		<!-- 上方展示区 -->
		<div>
			<a href="/">
				<img alt="" src="/resource/images/logo-admin.jpg">管理员中心
			</a>
		</div>
		<hr>
		<!-- //下方展示区 -->
		<div class="row">
			<!-- 左侧导航 -->
			<div class="col-md-2">
				<div class="list-group text-center">
				  <a href="#" class="list-group-item list-group-item-action active"
				  data="/admin/articles" >审核文章</a>
				  
				  <a href="#" class="list-group-item list-group-item-action" 
				  data="/admin/users">管理用户</a>
				 
				</div>
			</div>
			<!-- 右侧展示区 -->
			<div class="col-md-10">
				<div id="center">
					
				</div>	
			
			</div>
		
		</div>
		
	</div>
	
</body>
<script type="text/javascript">
	//文档就绪函数
	$(function(){
		$("#center").load("/admin/articles");
		//绑定连接事件
		$("a").click(function(){
			//获取标签中的属性
			var url=$(this).attr("data");
			$("#center").load(url);
			//将原来选中的变成不选中的
			$(".active").removeClass("active");
			//修改class属性，实现选中状态
			$(this).addClass("active");
	 
		})
	})

</script>
</html>
